import React, { useState, useEffect } from 'react';
import ConditionGroups from '../../../components/Conditions/ConditionGroups';
import ScriptEditor from '../../../components/ScriptEditor';
import services from '../../../services/api';
import { CONDITION_TYPE } from '../../../utils/constant';

export default function AddConditions(props) {
  const [operator, setOperator] = useState([]);

  useEffect(() => {
    getOperator(); //操作符
  }, []);

  function handleConditionsChange(value) {
    props.onChange && props.onChange(value);
  }

  // 获取操作符
  function getOperator() {
    services.indicator.getOperatorList({}).then((res) => {
      if (res.code === 0) {
        setOperator(res.data);
      }
    });
  }
  return (
    <div className='add-conditions-wrap'>
      {props.type === CONDITION_TYPE._CONFIG && (
        <ConditionGroups
          {...props}
          variable={props.variable}
          onChange={handleConditionsChange}
          value={props.value}
          compareData={props.compareData || []}
          operatorOptions={operator}
          disabled={props.disabled}
        />
      )}
      {props.type === CONDITION_TYPE._SQ && (
        <div style={{ marginBottom: '20px' }}>
          <ScriptEditor
            onChange={(value) => props.onChange && props.onChange(value)}
            value={props.conditionText}
            disabled={props.disabled}
            placeholder={`1.获取字段的值语法：field("字段code",ctx),获取指标的值语法：feature("指标code", ctx); 例如获取code为a的字段值 field("a",ctx)\n2.特殊类型的字段类型转换\n例如code为a的字段值是字符串, 获取a的int值：Integer.valueOf(field("a",ctx))\n3.表达式\n简单版：field("a",ctx) == null&&field("b",ctx) != null\n复杂版：Integer.valueOf(field("a",ctx)) == 0&&Double.valueOf(field("c",ctx))>5`}
          />
        </div>
      )}
    </div>
  );
}
